<template>
    <button @click="get">获取一句话</button>
    <ul v-for="i in talkStore.list" :key="i.id">
        <li>{{ i.title }}</li>
    </ul>

</template>

<script setup name='Talk'>
    import {reactive} from 'vue'
    import axios from 'axios'
    import {nanoid} from 'nanoid'
    import {useTalkStore} from '@/store/talk'
    let talkStore=useTalkStore()

    async function get(){
        //这个二度解构写法有点意思,解构出来又重命名
        let {data:{content:title}}=await axios.get('https://api.uomg.com/api/rand.qinghua?format=json')
        let obj={id:nanoid(),title}
        talkStore.list.push(obj)
    }

</script>

<style scoped>
</style>

